import { ComponentType } from 'react'
import Taro, { Component } from '@tarojs/taro'
import { View, Button } from '@tarojs/components'

import './index.scss'

class Index extends Component {
  state = {}

  componentWillMount() {}

  componentWillReact() {
    console.log('componentWillReact')
  }

  componentDidMount() {}

  componentWillUnmount() {}

  componentDidShow() {}

  componentDidHide() {}

  goToPage(url) {
    Taro.navigateTo({ url })
  }

  onShareAppMessage() {
    return {
      title: '测试webp兼容性',
      path: 'pages/index/index',
      imageUrl:
        'https://mt100180-1251601690.image.myqcloud.com/sphimspic/153053/de01cd60-54a1-11eb-bfc4-a318272ecfef_size_1000x827?imageView2/2/w/750/h/auto/q/100/format/webp|imageMogr2/auto-orient/strip'
    }
  }

  openThirdApp() {
    Taro.navigateToMiniProgram({
      appId: 'wx91d27dbf599dff74',
      path: 'pages/proxy/union/union?spreadUrl=https://u.jd.com/1K7bd11'
    })
  }

  render() {
    return (
      <View className="container">
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/swiperTest/index')}>
          轮播图组件
        </Button>
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/animators/mode/index')}>
          动画组件
        </Button>
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/webp/index')}>
          测试Webp图片
        </Button>
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/webp/webPage')}>
          测试webView显示Webp图片
        </Button>
        <Button className="button" onClick={this.openThirdApp}>
          测试打开外部小程序
        </Button>
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/camera/index')}>
          自定义扫码
        </Button>
        <Button className="button" onClick={this.goToPage.bind(this, '/subPackages/tvshow/index')}>
          视频推流
        </Button>
      </View>
    )
  }
}

export default Index as ComponentType
